<template>
  <vxe-table
    :data="FDatas"
    border
    show-overflow
    highlight-hover-row
    ref="xTable"
    :height="tableHeight"
  >
    <vxe-column field="Field0" title="Field0"></vxe-column>
    <vxe-column field="Field1" title="Field1"></vxe-column>
    <vxe-column field="Field2" title="Field2"></vxe-column>
    <vxe-column field="Field3" title="Field3"></vxe-column>
    <vxe-column field="Field4" title="Field4"></vxe-column>
    <vxe-column field="Field5" title="Field5"></vxe-column>
    <vxe-column field="Field6" title="Field6"></vxe-column>
    <vxe-column field="Field7" title="Field7"></vxe-column>
    <vxe-column field="Field8" title="Field8"></vxe-column>
    <vxe-column field="Field9" title="Field9"></vxe-column>
    <vxe-column field="Field10" title="Field10"></vxe-column>
    <vxe-column field="Field11" title="Field11"></vxe-column>
    <vxe-column field="Field12" title="Field12"></vxe-column>
    <vxe-column field="Field13" title="Field13"></vxe-column>
    <vxe-column field="Field14" title="Field14"></vxe-column>
    <vxe-column field="Field15" title="Field15"></vxe-column>
  </vxe-table>
</template>
<script lang="ts">
import TFormBase from "../BaseForm";
export default class vxTableTest extends TFormBase {
  //自动适应界面高度
  declare $refs: {
    xTable: any;
  };
  private tableHeight: number = 200;
  private FDatas: any[] = [];
  public created() {
    setTimeout(() => {
      let lTempArr: any[] = [];
      for (var i = 0; i <= 10000; i++) {
        let temp = {
          Field0: "Field0_" + i.toString(),
          Field1: "Field1_" + i.toString(),
          Field2: "Field2_" + i.toString(),
          Field3: "Field3_" + i.toString(),
          Field4: "Field4_" + i.toString(),
          Field5: "Field5_" + i.toString(),
          Field6: "Field6_" + i.toString(),
          Field7: "Field7_" + i.toString(),
          Field8: "Field8_" + i.toString(),
          Field9: "Field9_" + i.toString(),
          Field10: "Field10_" + i.toString(),
          Field11: "Field11_" + i.toString(),
          Field12: "Field12_" + i.toString(),
          Field13: "Field13_" + i.toString(),
          Field14: "Field14_" + i.toString(),
          Field15: "Field15_" + i.toString(),
        };
        lTempArr.push(temp);
      }
      this.FDatas = lTempArr;
    }, 1000);
  }
  public mounted() {
    //自适应列表高
    this.$nextTick(() => {
      if (this.$refs.xTable.$el != undefined) {
        let lHeight =
          window.innerHeight - this.$refs.xTable.$el.offsetTop - 120;
        this.tableHeight = lHeight;
      }
    });
    window.addEventListener("resize", () => {
      this.$nextTick(() => {
        if (this.$refs.xTable.$el != undefined) {
          let lHeight =
            window.innerHeight - this.$refs.xTable.$el.offsetTop - 120;
          this.tableHeight = lHeight;
        }
      });
    });
  }
}
</script>
